<template>
	<view style="position: relative;">
		<view
			style="position: absolute; top: 0;  width: 100%; height: 590rpx;background: linear-gradient(#f18f00, #f5a93c, #fce8c9)">

		</view>
		<view class="beijing" style="z-index: 10; position: relative;">
			<view class="" style="position: absolute; top: 113rpx; right: 20rpx;">
				<image src="../../static/图标-21.png" style="width: 80rpx; height: 80rpx;" mode=""></image>
			</view>
			<!-- <image style="width: 200rpx;height: 50rpx;margin-top: 93rpx;" src="../../static/xiaoyuanwaimai.png" mode=""> -->
			<!-- </image> -->
			<view class="dingwei" @click="getDingwei"
				:style="{zIndex: 11,paddingTop:`${(menu.top - system.statusBarHeight) * 2 + menu.height*4/3}rpx`}">
				<view class="title"
					:style="{color: 'white',zIndex: 10,display:'flex',alignItems:'center',flexDirection:'center'}">
					<div>
						<u-icon name="map" color="#fff" size="20"></u-icon>
					</div>
					<div style="margin-left: 10rpx;">
						{{addressaa2}}
					</div>

				</view>
				<view class="iconBox">
					<u-icon name="arrow-down" color="white"></u-icon>
				</view>

			</view>

		</view>

		<view class="" style="width: 700rpx;margin: 10rpx auto;margin-top: 0rpx;">
			<view
				style="width: 100%; position: relative; z-index: 10 ; border-radius: 15px; background-color: white; height: 60rpx; display: flex; align-items: center; justify-content: space-between;">
				<view
					style="width: 100rpx; height:45rpx ; border-radius: 10px;  margin-right: 0rpx; display: flex; justify-content: center; align-items: center;color: #fff;">
					<image style="width: 30rpx;height: 30rpx;" src="../../static/search.png" mode=""></image>
				</view>
				<input v-model="searchName" type="text" style=" width: 100%; font-size: 28rpx; " :placeholder="`请输入要搜索的内容`"
					 />
				<view @click="sousuo"
					style="width: 155rpx; height:45rpx ; font-size:26rpx;border-radius: 10px; background-color: orangered; margin-right: 10rpx; display: flex; justify-content: center; align-items: center;color: #fff;">
					搜索
				</view>
			</view>
		</view>



		<view class="topHead" style="z-index: 10;">

			<view class="swiperBox">
				<u-swiper keyName="image" :list="list1" @change="change" indicator indicatorMode="line" circular
					height="300rpx" imgMode="" radius='10px'></u-swiper>

				<!-- <u-swiper
					            :list="list1.image"
					            indicator
					            indicatorMode="line"
					            circular
					    ></u-swiper> -->


			</view>


		</view>
		<view class="lineHead">


			<view class="tops" style="display: flex;justify-content: space-between;align-items: center;height: 80rpx;">

				<view class="" style="display: flex;justify-content: center;align-items: center;" @click="goMiaosha">
					<image style="margin-left: 10rpx;width: 40rpx;height: 40rpx;" src="../../static/o3.png" mode="">
					</image>
					<view class="" style="padding-top: 5rpx;padding-left: 10rpx;font-size: 32rpx;font-weight: bold;">
						限时秒杀
					</view>
					<view class="" style="width: 300rpx;height: 50rpx; margin-left: 10rpx;border: 1rpx solid orange;
					border-radius: 30rpx;display: flex;font-size: 30rpx;">
						<view class=""
							style="color: #FFFFFF;line-height: 50rpx;width: 50%;background-color: orangered;border-radius: 30rpx;text-align: center;font-size: 24rpx;">
							{{changci}}场次
						</view>
						<view class="" style="width: 50%;line-height: 50rpx;text-align: center;font-size: 24rpx;">
							00:{{minutes}}:{{seconds}}
						</view>
					</view>
					<view class="">
						<u-icon name="arrow-right" color="#000" size="28"></u-icon>
					</view>
				</view>

				<view class="" style="text-align: center;">
					<image style="width: 50rpx; height: 50rpx;;line-height: 50rpx;" src="../../static/arrow.png"
						mode=""></image>
				</view>

			</view>

			<view class="boms" style="display: flex;font-size: 24rpx;
			align-items: center;justify-content: space-between;color: red;overflow-x: scroll;">
				<view class="" style="text-align: center;margin: 20rpx;" v-for="(item,index) in timeSHA" :key="index">
					<image style="width: 135rpx;height: 135rpx;border-radius: 10rpx;" :src="item.images"
						mode=""></image>
					<view class="">
						￥{{item.discount_price}}限时
					</view>
				</view>
				
				
			</view>
		</view>
		<view class=""
			style="width: 95%;margin: 20rpx auto;display: flex;flex-wrap: wrap;">
			
			
			<view @click="goBwc" class="zuo" v-if="sygg[0].image" style="width: 48%;">
			    <image style="width: 335rpx;height: 200rpx;" :src="sygg[0].image" mode=""></image>
			</view>
			
			<view class="you" v-if="sygg[1].image" style="width: 48%;margin-left: 20rpx;">
			    <image  @click="goMfpeisong" style="width: 335rpx;height: 200rpx;" :src="sygg[1].image" mode=""></image>
			</view>
			
			<view class="zuo" v-if="sygg[2].image" style="width: 48%;">
			    <image style="width: 335rpx;height: 200rpx;" :src="sygg[2].image" mode=""></image>
			</view>
			<view class="you" v-if="sygg[3].image" style="width: 48%;margin-left: 20rpx;">
			    <image style="width: 335rpx;height: 200rpx;" :src="sygg[3].image" mode=""></image>
			</view>
			<view class="zuo" v-if="sygg[4].image" style="width: 48%;">
			    <image style="width: 335rpx;height: 200rpx;" :src="sygg[4].image" mode=""></image>
			</view>
			<view class="you" v-if="sygg[5].image" style="width: 48%;margin-left: 20rpx;">
			    <image style="width: 335rpx;height: 200rpx;" :src="sygg[5].image" mode=""></image>
			</view>
		</view>
		

		<view class="" style="width: 95%;margin: 20rpx auto;">
			<view class=""
				style="display: flex;text-align: center;justify-content: space-around;font-size: 26rpx;flex-wrap: wrap;">
				<view class="" style="margin: 20rpx;" v-for="(item,index) in lists" :key="index" @click="toShop(item,index)">
					<image style="width: 100rpx;height: 100rpx;border-radius: 50%;" :src="item.image"
						mode=""></image>
					<view class="" style="font-size: 24rpx;">
						{{item.title}}
					</view>
				</view>
				
				

			</view>
			<view class="" style="display: flex;text-align: center;justify-content: space-around;">

			</view>


		</view>



		<view v-if="is_shows == 1" class="" style="width: 95%;height: 200rpx;margin: 10rpx auto;">
			<image @click="goSend" style="width: 100%;height: 100%;border-radius: 10rpx;" :src="sytj" mode=""></image>
		</view>

		<filter-select @tabClick="tabClick">
			
		</filter-select>

		<view class="zonghezi" v-for="(item,index) in dianpu" :key="index" @click="goshopDetail(item)">
			<view class="" style="width: 28%;">
				<image style="width: 100%;height: 200rpx;" :src="item.image" mode=""></image>
			</view>
			<view class="" style="width: 65%;">
				<view class="" style="width: 100%;display: flex;justify-content: space-between;padding-top: 10rpx;">
					<view class=""
						style="background-color: orangered;color: #fff;border-radius: 10rpx;padding: 5rpx;font-size: 22rpx;">
						29分钟超时赔付
					</view>
					<view v-if="item.is_open == 0" class="" style="border: 1rpx solid #f18f00;padding: 5rpx;color: #f18f00;border-radius: 10rpx;font-size: 22rpx;">
						暂停营业
					</view>
					<view v-if="item.is_open == null" class="" style="border: 1rpx solid #f18f00;padding: 5rpx;color: #f18f00;border-radius: 10rpx;font-size: 22rpx;">
						暂停营业
					</view>
					<view v-if="item.is_open == 1" class="" style="border: 1rpx solid #f18f00;padding: 5rpx;color: #f18f00;border-radius: 10rpx;font-size: 22rpx;">
						
						正在营业
					</view>
				</view>
				<view class=""
					style="width: 100%;padding: 5rpx; white-space: nowrap;overflow: hidden; text-overflow: ellipsis; ">
					{{item.store_name}}
				</view>
				<view class="" style="display: flex;align-items: center;font-size: 30rpx;margin-top: 10rpx;">

					<!-- <score-box :size="10" v-model="value"></score-box> -->
					<u-rate :count="5" :value="3" size="15"></u-rate>
					<text style="font-size: 22rpx;color: #999999;">10公里内10元起送</text>
				</view>
				<view class="" style="margin-top: 20rpx;font-size: 26rpx;color: #999;font-size: 22rpx;color: #f18f00;">
					<span v-if="item.distance > 1000">{{item.address}} 距离我 {{(item.distance / 1000).toFixed(1)}}km</span>
					<span v-if="item.distance < 1000">{{item.address}} 距离我 {{item.distance.toFixed(1)}}m</span>
				</view>
				
				<!-- <view class="" style="display: flex;width: 100%;overflow-x: scroll;">
					<view class="" style="text-align: center;margin: 20rpx;">
						<image style="width: 135rpx;height: 135rpx;border-radius: 10rpx;" src="../../static/toux.jpg" mode=""></image>
						<view class="" style="font-size: 22rpx;">
							玉米猪肉饺子
						</view>
						<view class="">
							￥10.08
						</view>
					</view>
					
				</view> -->

			</view>

		</view>

		<!-- 首页广告 -->
		<view v-if="apiGuang == true" class="indexGuange">
			<!-- 内容展示部分 -->
			<view class="guanggao">
				<image style="width: 100%;height: 100%;" :src="guangg" mode=""></image>
			</view>

			<view @click="guanbi" class="guanbi">
				X
			</view>
		</view>
		<view style="width:100%;height: 100rpx;"></view>
	</view>
</template>

<script>
	import store from '../../store'

	import {
		mapActions,
		mapGetters
	} from 'vuex';
	export default {
		computed: {
			...mapGetters(['userInfo', 'getOpenId']),

		},

		onShow() {
			this.getBanner()
			this.addressName = uni.getStorageSync('addressName')
			this.addressaa2 = uni.getStorageSync('otherAddress')


			this.getLocaFenlei()
			this.getDianpu()
			this.getFenList()
			this.getSomeImage()
			// this.getTimeSha()
		},
		
		onLoad() {
			uni.getSystemInfo({
				success: res => {
					this.system = res
				}
			})
			this.menu = uni.getMenuButtonBoundingClientRect()
			this.init()
			this.addressName = uni.getStorageSync('addressName')
			this.userId = uni.getStorageSync('userId')
			if (this.userId == '' ) {
				uni.navigateTo({
					url: '/login-pkg/login/login'
				})
				
			}

			this.apiGuang = true
			uni.setStorageSync('addressName',this.xxxxxx)
			uni.setStorageSync('addressId',this.xxxxxxId)
			
			
		},
		
		data() {
			return {
				system: null,
				menu: null,

				//搜索关键字
				keyword: '',
				tabList: [],
				list1: [],
				dataList: [],
				pageNum: 1,
				goodClassId: null,
				lng: '',
				lat: '',
				locationName: '定位中',
				store_id: '',
				arr1: [],
				arr2: [],
				phone: '',
				text1: '',
				schoolId: '',
				value: 3,
				addressName: '',
				xxxxxx:'内蒙古农业大学职业学校',
				xxxxxxId:'4',


				xuexiaoList: [],
				chooseValue: "",
				userId: '',
				apiGuang: false,
				fenlei: '',
				lists: '',
				dianpu: [],

				// 筛选数据
				fenleiAll: '',
				fenleiList: [{
						name: '新鲜水果',
						id: 1
					},
					{
						name: '中式快餐',
						id: 2
					},
					{
						name: '汉堡披萨',
						id: 3
					}
				],
				guangg:'',
				sytj:'',
				sygg:[],
				timeSHA:[],
				changci:'',
				djsTime:'',
				remainingTime: 0,
			    minutes: 0,
			    seconds: 0,
				searchName:'',
				is_shows:'',
				jingdu:'',
				weidu:'',
				addressaa:'',
				addressaa2:'',
				
				
				// 筛选数据
				good_cate_id:'',
				good_type:'',
				good_is_open:''
			}
		},
		
		methods: {
			toShop(item,index) {
				uni.navigateTo({
					url: `/shopDetail-pkg/shopList/shopList?index=${index}&id=${item.id}`
				})
				
			},
			look() {
				console.log(this.fenleiAll)
			},
			sousuo() {
				let key = this.searchName
				this.$req('GET', this.$api.dianpuList, {
					school_id:uni.getStorageSync('addressId'),
					cate_id: uni.getStorageSync('fenlei'),
					user_id:uni.getStorageSync('userId'),
					keyword:key
				}).then(res => {
					this.dianpu = res.data.info
				
				
				})
			},
			login() {
				uni.navigateTo({
					url: `/login-pkg/login/login`
				})
			},
			init() {
				this.getBanner()
				this.getFenList()
				this.getSchoolList()

			},
			switchTab(url) {
				uni.switchTab({
					url: '/address-pkg/address/address'
				})
			},
			getPhone() {
				this.$req('POST', this.$api.articleContract, {

				}).then(res => {
					this.phone = res.data.phone
				})
			},
			call() {
				let that = this
				uni.makePhoneCall({
					phoneNumber: String(that.phone) //仅为示例
				});
			},

			async getBanner() {
				try {
					const res = await this.$req("POST", this.$api.BannerList, {});
					this.list1 = res.data;


				} catch (error) {
					console.error("Error fetching banner:", error);
					// 你可以在这里处理错误，例如设置一个错误状态
				}
			},

			//跳转
			navigator(url) {
				if (url == '/school/changeSchool/changeSchool') {
					uni.$on('changeSchool', (data) => {
						
						this.init()
						uni.$off('changeSchool')
					})
				}
				uni.navigateTo({
					url
				})
			},

			change(e) {
			},
			// 获取学校列表
			getSchoolList() {
				this.$req('GET', this.$api.SchoolList, {}).then(res => {


					this.xuexiaoList = res.data.list

				})
			},
			guanbi() {
				this.apiGuang = false
			},
			allQuYu() {
				uni.navigateTo({
					url: `/select-pkg/select/select?type=${0}`
				})
			},
			allFenLei() {
				uni.navigateTo({
					url: `/select-pkg/select/select?type=${1}`
				})
			},
			allPaiXu() {
				uni.navigateTo({
					url: `/select-pkg/select/select?type=${2}`
				})
			},
			getFenList() {
				this.$req('GET', this.$api.fenLlist, {}).then(res => {

					// this.lists = res.data.list.map(item => ({ name: item.title }));
					this.lists = res.data.list

				})
			},
			// 获取本地的分类
			getLocaFenlei() {
				this.fenlei = uni.getStorageSync('feenleiTitle')
			},
			// 获取商家店铺
			getDianpu() {
				this.$req('GET', this.$api.dianpuList, {
					school_id:uni.getStorageSync('addressId'),
					cate_id: uni.getStorageSync('fenlei'),
					user_id:uni.getStorageSync('userId'),
					lat:uni.getStorageSync('jingdu'),
					lng:uni.getStorageSync('weidu')
				}).then(res => {
					this.dianpu = res.data.info.data

					console.log(this.dianpu,'查看获取的数据')
				})
			},
			goBwc() {
				uni.navigateTo({
					url: '/takeout-pkg/takeout/takeout'
				})
			},
			goMfpeisong() {
				uni.navigateTo({
					url: '/free-pkg/free/free'
				})
			},
			goshopDetail(item) {
				uni.navigateTo({
					url: `/shopDetail-pkg/shopDetail/shopDetail?id=${item.id}&value=${this.value}&count=${this.count}&title=${item.store_name}&is_collect=${item.is_collect}`
				})
			},
			getList() {
				this.$req('POST',this.$api.SchoolList,{
					
				}).then(res => {
					this.lista = res.data.list
				})
			},
			getSomeImage(){
				this.$req('GET',this.$api.getImages,{
					
				}).then(res =>{
					console.log(res,'查看这个res是什么sygg的')
					this.guangg = res.data.adv.image
					this.sytj = res.data.coupon.image
					this.is_shows = res.data.coupon.is_show
					this.sygg = res.data.top
					
				})
				console.log(this.sygg,'查看这个sygg是什么')
			},
			tabClick(event){
				// switch (event.id){
				// 	case 1:
				// 	this.good_cate_id =event.item_id
				// 		break;
				// 	case 2:
				// 	this.good_type =event.item_id
				// 		break;
				// 	case 3:
				// 	this.good_is_open =event.item_id
				// 		break;
				// 	default:
				// 		break;
				// }
				
				console.log(event,'查看打印的event')
				
				if(event.id == 1){
					this.$req('GET', this.$api.dianpuList, {
						school_id:uni.getStorageSync('addressId'),
						cate_id:event.item_id,
						user_id:uni.getStorageSync('userId'),
						lat:uni.getStorageSync('jingdu'),
						lng:uni.getStorageSync('weidu')
					}).then(res => {
						this.dianpu = res.data.info.data
					})
				}else if(event.id ==2){
					this.good_type =event.item_id
					this.$req('GET', this.$api.dianpuList, {
						school_id:uni.getStorageSync('addressId'),
						// cate_id:uni.getStorageSync('fenlei'),
						type:this.good_type,
						user_id:uni.getStorageSync('userId'),
						lat:uni.getStorageSync('jingdu'),
						lng:uni.getStorageSync('weidu')
					}).then(res => {
						this.dianpu = res.data.info.data
					})
				}else if(event.id ==3){
					this.good_is_open =event.item_id
					this.$req('GET', this.$api.dianpuList, {
						school_id:uni.getStorageSync('addressId'),
						cate_id:this.good_cate_id,
						is_open:this.good_is_open,
						user_id:uni.getStorageSync('userId'),
						lat:uni.getStorageSync('jingdu'),
						lng:uni.getStorageSync('weidu')
					}).then(res => {
						this.dianpu = res.data.info.data
					})
				}
				
				
				
				// if(this.good_type != ''){
				// 	this.$req('GET', this.$api.dianpuList, {
				// 		school_id:uni.getStorageSync('addressId'),
				// 		cate_id:this.good_cate_id,
				// 		type:this.good_type,
				// 		user_id:uni.getStorageSync('userId'),
				// 		lat:uni.getStorageSync('jingdu'),
				// 		lng:uni.getStorageSync('weidu')
				// 	}).then(res => {
				// 		this.dianpu = res.data.info.data
				// 	})
				// }else if(this.good_is_open != ''){
				// 	this.$req('GET', this.$api.dianpuList, {
				// 		school_id:uni.getStorageSync('addressId'),
				// 		cate_id:this.good_cate_id,
				// 		user_id:uni.getStorageSync('userId'),
				// 		lat:uni.getStorageSync('jingdu'),
				// 		lng:uni.getStorageSync('weidu')
				// 	}).then(res => {
				// 		this.dianpu = res.data.info.data
				// 	})
				// }else {
				// 	this.$req('GET', this.$api.dianpuList, {
				// 		school_id:uni.getStorageSync('addressId'),
				// 		cate_id:this.good_cate_id,
				// 		type:this.good_type,
				// 		is_open:this.good_is_open,
				// 		user_id:uni.getStorageSync('userId'),
				// 		lat:uni.getStorageSync('jingdu'),
				// 		lng:uni.getStorageSync('weidu')
				// 	}).then(res => {
				// 		this.dianpu = res.data.info.data
				// 	})
				// }
				
				
				
				
				
				// this.$req('GET', this.$api.dianpuList, {
				// 	school_id:uni.getStorageSync('addressId'),
				// 	cate_id:this.good_cate_id||'',
				// 	type:this.good_type||'',
				// 	is_open:this.good_is_open||'',
				// 	user_id:uni.getStorageSync('userId'),
				// 	lat:uni.getStorageSync('jingdu'),
				// 	lng:uni.getStorageSync('weidu')
				// }).then(res => {
				// 	this.dianpu = res.data.info.data
				// })
			},
		
			getTimeSha() {
			  // timeDay
			  this.$req('GET', this.$api.timeDay, {}).then(res => {
			    this.changci = res.data.info.title;
			    this.timeSHA = res.data.list.data;
			    // this.djsTime = res.data.during;
			    this.remainingTime = res.data.during;
			
			    const interval = setInterval(() => {
			      this.remainingTime--;
			      this.minutes = Math.floor(this.remainingTime / 60);
			      this.seconds = this.remainingTime % 60;
			      if (this.remainingTime <= 0) {
			        clearInterval(interval);
			      }
			    }, 1000);
			
			    console.log(this.timeSHA, '查看res显示秒杀');
			  });
			},
			goMiaosha(){
				uni.navigateTo({
					url: '/writeaddress-pkg/miaosha/miaosha'
				})
			},
			goSend(){
				uni.navigateTo({
					url: '/shoucangdp-pkg/sendfriends/sendfriends'
				})
			},
			getDingwei(){
				wx.chooseLocation({
				  success: function(res) {
					console.log('succes1')
					console.log(res)
					this.jingdu = res.latitude
					this.weidu = res.longitude
					console.log(this.jingdu,'this.jingdu')
					console.log(this.weidu,'this.weidu')
					
					
					
					this.addressaa = res.name
					uni.setStorageSync('otherAddress',this.addressaa)
					
					uni.setStorageSync('jingdu',this.jingdu)
					uni.setStorageSync('weidu',this.weidu)
					
				  },
				  fail: function(fail) {
					  console.log(fail,'failfailfail')
					wx.getSetting({
					  success(res) {
						if (!res.authSetting['scope.userLocation']) {
						  console.log("f1")
						  wx.authorize({
							scope: 'scope.userLocation',
							success() {
							  wx.chooseLocation({
								success: function(res) {
								  that.setData({
									addr: res.address //调用成功直接设置地址
								  })
								},
							  })
							  console.log('success2')
							  
							  
							},
							fail(){
							  console.log("f2")
							}
						  })
						}
					  }
					})
				  }
				})
			},

		},
		mounted() {
		    this.getTimeSha();
		},
	}
</script>

<style lang="scss">
	page {
		background: #f6f5f7;
	}

	.span-box {
		display: flex;
		align-items: center;
		margin-bottom: 10px;
		margin-top: 20px;
	}

	.iden {
		width: 2px;
		height: 15px;
		background: #FA7819;
		margin-right: 10px;
	}

	.swiperBox {
		// background-color: #FFF;
		// border-radius: 30rpx 30rpx 0 0;
		padding-top: 30rpx;
		margin-top: -30rpx;
		// border-radius: 20px;
		overflow: hidden;
	}

	.beijing {
		// height: 300rpx;
		// background: linear-gradient(#f18f00, #f5a93c, #fce8c9);
		// 
		padding: 30rpx 30rpx;
		box-sizing: border-box;

	}

	.vipBox {
		background: linear-gradient(to right, #f18f00, #f5a93c, #fce8c9);
		width: 700rpx;
		border-radius: 30rpx;
		margin: 50rpx auto 0 auto;
		position: relative;

		.go {
			position: absolute;
			top: 50rpx;
			right: 60rpx;
			display: flex;
			color: #FFFFFF;

			.left3 {
				font-size: 32rpx;
			}
		}

		.maxVip {
			width: 700rpx;
			height: 150rpx;
			border-radius: 30rpx;
			margin: 0 auto;
		}

		.user {
			background-color: #FFFFFF;
			width: 200rpx;
			border-radius: 30rpx;
			height: 50rpx;
			line-height: 50rpx;
			text-align: center;
			position: absolute;
			top: 50rpx;
			left: 200rpx;
			color: #69414e;
		}

		.vips {
			position: absolute;
			top: 20rpx;
			left: 50rpx;
			width: 100rpx;
			height: 100rpx;
		}
	}

	.lineHead {
		// width: 750rpx;
		width: 93%;
		padding: 5rpx 5rpx;
		box-sizing: border-box;
		background-color: #FFFFFF;
		box-shadow: 0px 3rpx 20rpx 0px rgba(0, 0, 0, 0.07);
		border-radius: 30rpx 30rpx;
		// margin-top: 10rpx;
		margin: 0 auto;
		margin-top: 25rpx;
	}

	.boxs {
		width: 700rpx;

		padding: 50rpx 30rpx;
		box-sizing: border-box;
		background-color: #FFFFFF;
		border-radius: 30rpx;
		margin-top: 50rpx;
	}

	.noticeBar {
		margin-top: 20rpx;
	}

	.menuBox {
		display: flex;
		justify-content: space-between;
		margin-top: 50rpx;

		.module {
			width: 200rpx;
			text-align: center;

			.img {
				width: 100rpx;
				height: 100rpx;
				scale: (1.3);
			}

			.title {
				text-align: center;
				margin-top: 15rpx;

			}
		}
	}

	.topHead {
		width: 95%;
		padding: 20rpx 10rpx;
		margin-left: 10rpx;

	}

	.topHead_top {
		width: 100%;
	}

	.dingwei>view {
		margin-right: 20rpx;
	}

	.dingwei {
		display: flex;
		margin-top: 20rpx;
		align-items: center;
		// margin-bottom: 40rpx;

		.img {
			width: 30rpx;
			height: 40rpx
		}

		.title {
			font-size: 32rpx;
			color: #FFFFFF;
			font-weight: bold;
		}

		.iconBox {
			padding: 10rpx 0;
		}
	}

	.join {
		width: 600rpx;
		margin: 50rpx auto;

	}

	.lineTitle {
		display: flex;
		margin: 30rpx;

		.shu {
			background-color: #3d9dff;
			width: 7rpx;
			height: 35rpx;
			margin-right: 20rpx;
			margin-top: 5rpx;
		}
	}

	.locationBox {
		position: fixed;
		top: 0rpx;
		width: 750rpx;
		background-color: #FFFFFF;
		display: flex;
		justify-content: space-between;
		padding: 10rpx 20rpx;
		box-sizing: border-box;
		margin-bottom: 20rpx;
		z-index: 9999;

		.left {
			display: flex;

			.icon {
				margin-left: 10rpx;
				margin-top: 5rpx;
			}
		}
	}

	/deep/ .u-icon text {
		padding: 0 !important;
	}

	.menu {
		width: 750rpx;
		display: flex;
		padding: 0 20rpx;
		box-sizing: border-box;
		text-align: center;
		flex-wrap: wrap;
		margin-top: 50rpx;

		.module {
			width: 142rpx;
			font-size: 25rpx;
			margin-bottom: 20rpx;
			padding: 0 20rpx;
			box-sizing: border-box;

			.img {
				margin-bottom: 10rpx;
				width: 80rpx;
				height: 80rpx;
			}

		}
	}

	.taking1 {
		width: 170rpx;
		height: 50rpx;

		background: #f47e42;
		display: flex;
		// justify-content: center;
		align-items: center;
		padding-left: 20rpx;
		position: absolute;
		right: 40rpx;
		top: 45rpx;
		border-radius: 15px;

	}

	.indexGuange {
		width: 100vw;
		height: 100vh;
		z-index: 99999;
		position: fixed;
		top: 0;
		left: 0;
		background-color: rgba(0, 0, 0, 0.5);

	}

	.guanggao {
		width: 640rpx;
		height: 1130rpx;
		margin: 50rpx auto;
		margin-top: 170rpx;
		border-radius: 20rpx;
	}

	.yangshi {
		width: 200rpx;
		height: 60rpx;
		text-align: center;
		line-height: 60rpx;
		border: 1rpx solid #ccc;
	}

	.waimai {
		width: 100%;
		height: 100rpx;
		background-color: #f18f00;
		border-radius: 20rpx 20rpx 0 0;
		font-family: someFont;
		font-style: italic;
		text-align: center;
		line-height: 100rpx;
		font-size: 50rpx;
		font-weight: 900;
		color: #fff;
	}

	.guanbi {
		width: 60rpx;
		height: 60rpx;
		border-radius: 50%;
		margin: 0 auto;
		text-align: center;
		line-height: 60rpx;
		font-size: 40rpx;
		border: 5rpx solid #fff;
		color: #fff;
		margin-top: 50rpx;
	}

	.xuanze {
		width: 100vw;
		height: 100vh;
		background-color: rgba(0, 0, 0, 0.5);
		position: fixed;
		top: 0;
		left: 0;
		z-index: 999;
	}

	.shaixuan {
		width: 95%;
		height: 100rpx;
		// background-color: red;
		margin: 0 auto;
		display: flex;
		justify-content: space-between;
		align-items: center;
		text-align: center;

	}

	.quyu {
		width: 200rpx;
		height: 80rpx;
		line-height: 80rpx;
		border: 1rpx solid #ccc;
	}

	.zonghezi {
		margin: 20rpx auto;
		width: 95%;
		display: flex;
		justify-content: space-around;
		background-color: #fff;
	}
</style>